<template>
  <normal-content ref="content"
                  :cache-id="dataId"
                  class="h-100 pe-2"
                  :filter.sync="filter"
                  pageLayout="total, sizes, prev, next, jumper"
                  :shadow="false"
                  :tblOptions.sync="tblOptions"
                  @command="doCommand"
                  @current-change="row => selectRow = row"
                  @page-change="doCommand('search')"
                  @row-dblclick="row => showCustomerInfoDrawer(row)"
                  @selection-change="rows => { checkRows = rows;}">
    <vxe-column field="status"
                title="状态"
                width="90">
    </vxe-column>
    <vxe-column field="triggerTime"
                title="时间"
                width="85">
      <template #default="{row}">
        {{ row["triggerTime"] | formatDate }}<br />
        {{ row["triggerTime"] | time }}
      </template>
    </vxe-column>
  </normal-content>
</template>

<script lang="ts">
  import { Component, Mixins, Prop, Watch } from "@some21/vue-class-decorator";
  import NormalContentMixins from "@/mixins/NormalContentMixins";

  import { getTaskLogs } from "@/pages/index/apis/Layout";
  import { createFilterData, createTableOptions } from "@/framework/models/TableOptions";
  import { SearchDto } from "@/framework/models/SearchDto";

  @Component({
    name: "task-logs-block",
    components: {
      NormalContent: () => import("../../NormalContent.vue"),
    },
  })
  export default class extends Mixins(NormalContentMixins) {
    // 任务的数据ID
    @Prop({ required: true })
    dataId: any;

    filter = createFilterData();
    tblOptions = createTableOptions({ rowKey: "id" });

    @Watch("dataId")
    onDataIdChange() {
      this.reloadData();
    }
    created() {
      this.reloadData();
    }

    createSearchDto() {
      const searchDto = new SearchDto();
      searchDto.Page = this.tblOptions.currentPage;
      searchDto.Size = this.tblOptions.pageSize;
      searchDto.Search = true;
      // searchDto.Sord = "`row` asc";
      // searchDto.Sord = "CreateTime desc";

      return searchDto;
    }
    async reloadData() {
      const searchDto = this.createSearchDto();
      await this.loadData(searchDto);
    }

    async loadData(searchDto: SearchDto) {
      this.tblOptions.loading = true;
      try {
        const { data: response } = await getTaskLogs(this.dataId, searchDto);
        this.tblOptions.data = response.data;
        this.tblOptions.total = response.totalItemCount;
      } finally {
        this.tblOptions.loading = false;
      }
    }

    // eslint-disable-next-line
    async doCommand(command, data?) {
      switch (command) {
        case "search":
          {
            const searchDto = this.createSearchDto();

            await this.loadData(searchDto);
            this.selectRow = null;
            this.checkRows = [];
          }
          break;
      }
    }
  }
</script>

<style lang="scss" scoped>
</style>
